<template>
  <el-dialog title="分配权限" :visible="showDialog" @close="closeFn">
    <!-- 分配权限 -->
    <!-- <el-tree
      ref="tree"
      :data="permList"
      :props="{label:'title'}"
      show-checkbox
      node-key="id"
    /> -->
    <el-tree
      ref="tree"
      node-key="id"
      show-checkbox
      check-strictly
      :data="permList"
      :props="{label:'title'}"
    />
    <el-row type="flex" justify="end">
      <el-button type="primary" size="mini" @click="submit">确定</el-button>
      <el-button size="mini" @click="closeFn">取消</el-button>
    </el-row>
  </el-dialog>
</template>

<script>
import { getPermssion } from '@/api/permssion'
import { rolesId, updateRoleId } from '@/api/roles'
import { getArrList } from '@/utils/index'
export default {
  props: {
    showDialog: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      permList: [],
      permIds: [],
      curRoleId: null,
      halfId: []
    }
  },
  created() {
    this.getPermssionList()
  },
  methods: {
    closeFn() {
      this.$emit('update:showDialog', false)
    },
    async getPermssionList() {
      const res = await getPermssion()
      this.permList = getArrList(res.data, '0')
      console.log(res)
    },
    async getRolePerm(id) {
      this.curRoleId = id
      const res = await rolesId(id)
      console.log(res.data.permissions)
      // this.permList = getArrList(res.data.permissions, '0')
      res.data.permissions.forEach(item => {
        this.permIds.push(item.id)
      })
      this.$refs.tree.setCheckedKeys(this.permIds)
      // const newTreelist = new Set([...this.permIds])
      // const arr1 = this.$refs.tree.getHalfCheckedNodes()
      // console.log(arr1)
      // 获取班选中的id
    },
    async submit() {
      const arr1 = this.$refs.tree.getHalfCheckedNodes()
      arr1.forEach(v => {
        this.halfId.push(v.id)
      })
      console.log(this.halfId)
      this.permIds = this.$refs.tree.getCheckedKeys()
      const newarr = new Set([...this.halfId, ...this.permIds])
      const ress = await updateRoleId({
        id: this.curRoleId,
        permissions: [...newarr]
      })
      console.log(this.permList)
      this.getPermssionList()
      console.log(ress, [...newarr])
      this.closeFn()
    }
  }
}
</script>

<style>

</style>
